<template>
    <div style="height:100%">
      <Navt :title="SF?'建言献策（校领导）':'建言献策（教职工）'" @customRouter="customRouter"></Navt>
      <router-view @cnt="chanageN" @wt="chanageN"></router-view>
    </div>
</template>

<script>
export default {
    data() {
        return {
            ndata: true,
            SFA: '',
            sta1: 1,
            SF: ''
        }
    },
    components: {
        Navt: () => import('../../components/common/Nav.vue'), // nav头部
    },
    methods: {
        chanageN() { // 点击子组件查看详情触发建议
            this.ndata = false // 修改nav的状态显示
        },
        customRouter() {
            this.ndata = true
            if (this.SF) {
                this.$router.push('/SAhome')
            } else {
                this.$cjc.closeWebView() // 退出程序的函数方法
            }
        }
    },
    created() {
        this.SF = sessionStorage.getItem('SF')
    }
}
</script>

<style lang="less">
@navColor: #ffffff; //nav背景颜色
@navTextColor: #000000; // nav字体颜色
@navHeight: 50px; // nav高度
.nav {
    width: 100%;
    height: 50px;
    background-color: @navColor;
    color: @navTextColor;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    top: 0;
    z-index: 9;
    box-shadow: 0 2px 3px #eaeaea;
    .click-size.size {
        font-size: 16px;
    }
    .title {
        font-weight: bold;
        font-size: 15px;
        letter-spacing: 0;
    }
}

.nav-left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 27% !important;
    span {
        margin-right: 5px;
    }
}

.nav-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 22% !important;
    height: @navHeight;
    .nav-right-text {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 65px;
        height: @navHeight;
        &:active {
            background-color: @navColor/1.5;
        }
    }
    .nav-right-content {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        align-self: flex-end;
        width: 100%;
        height: @navHeight;
        margin-right: 10px;
        img {
            width: 25px;
        }
    }
}

.back-area {
    height: @navHeight;
    width: 69%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    >div {
        display: flex;
        justify-content: center;
        align-items: center;
        height: @navHeight;
        margin-right: 5px;
    }
    &:active {
        background-color: @navColor / 1.5;
    }
    .text {
        color: #0093dd;
        font-size: 16px;
    }
}

.back-img {
    overflow: hidden;
    img {
        height: 18px !important;
    }
}

.information-img {
    height: 18px !important;
    margin-right: 2px;
}
</style>
